<!--消息中心-->
<template>
  <div class="all bg1" @rightBtn="allClick">

    <!-- 无数据 -->
    <VTips v-if="!datas.length"></VTips>

    <!-- 导航栏 -->
    <div class="nav">
      <div class="nav-but"  @click="navClick(0)">
        <text :class="['font32', tabIndex == 0 ? 'text2' : 'text3']">{{T("个人消息")}}</text>
        <div :class="['nav-line', (tabIndex == 0 ? 'main1' : '')]"></div>
      </div>
      <div class="nav-but" @click="navClick(1)">
        <text :class="['font32', tabIndex == 1 ? 'text2' : 'text3']">{{T("系统公告")}}</text>
        <div :class="['nav-line', (tabIndex == 1 ? 'main1' : '')]"></div>
      </div>
    </div>

    <!-- 列表 -->
    <list class="list" :loadmoreoffset="50" @loadmore="httpNoticesLoading">
      
      <!--刷新-->
      <refresh @refresh="httpNotices" :display="isRefresh ? 'show' : 'hide'">
        <loading-indicator class="load text1"></loading-indicator>
      </refresh>

      <cell v-for="(item, index) in datas" v-bind:key="index">

        <!-- 内容 -->
        <div :class="['cell', item.isRead ? '' : 'bt2']" @click="cellClick(item)">

          <div class="row all acenter">
            <div class="tag warning1" v-if="!item.isRead"></div>
            <text class="font32 text2 title">{{T(item.title)}}</text>
          </div>

          <template v-if="item.digest && item.digest.length">
            <div class="height10"></div>
            <text class="font24 text3 text">{{T(item.digest)}}</text>
          </template>

          <div class="height20"></div>
          <text class="font24 text3">{{item.showTime}}</text>

          <div class="cell-line line1"></div>
        </div>

        <!-- 无更多数据 -->
        <div class="genduo" v-if="pageMax && (index == datas.length - 1)">
          <text class="font22 text3">{{T('没有更多数据')}}</text>
        </div>
      </cell>
    </list>
  </div>
</template>

<style src="@/_css/style.css" ></style>
<style scoped>
/**************** 菜单栏 */
.nav{
  flex-direction: row;
  padding-top: 30px;
}
.nav-but{
  align-items: center;

  padding-left: 40px;
  padding-right: 40px;
}
.nav-line{
  width:62px;
  height: 4px;
  border-radius: 4px;
  margin-top: 10px;
}

/**************** 列表 */
.list {
  flex: 1;
  
  margin-top: 2px;
}
.cell {
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 30px;
  padding-bottom: 30px;
}
.cell-line{
  position: absolute;
  height: 1;
  left: 30;
  right: 0;
  bottom: 0;
}
.tag{
  width:12px;
  height:12px;
  border-radius:12;

  margin-right:10px;
}
.title {
  flex: 1;
  lines: 1;
  text-overflow: ellipsis;
}
.text {
  flex: 1;
  lines:2;
  text-overflow: ellipsis;
}

/**************** 加载 */
.load {
  height: 40px;
  width: 40px;

  margin-top: 20px;
  margin-left: 355px;
}
.genduo {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 750px;
  height: 100px;
}
</style>

<script>

//组件
import VTips from "@/_public/VTips";

//功能
import jnavigator from "@/_js/navigator";
import jhttps from "@/_js/https";
import jtime from "@/_js/time";
import jmodal from "@/_js/modal";
import jdebug from "@/_js/debug";

const weexFunction = weex.requireModule("WeexFunction");

import I18N from "@/_i18n/i18n";
var T = I18N.t;
weexFunction.setTitle(T("消息中心"));
weexFunction.setRightBtn(T("全部已读"));

export default {
  components: {
    VTips,
  },

  data() {
    return {
      T:T,

      tabIndex:1,

      pageNo:0, //页码
      pageMax:false, //turn最大页面
      isRefresh:false, //显示刷新
      isLoadinging:false, //显示加载

      datas:[],
    };
  },

  created() {
    this.httpNotices();
  },

  methods: {

    initData(datas){

      for(var i = 0;i < datas.length;i++){
        var item = datas[i];
        item.showTime = jtime.getTime(item.showTime, 'y/M/d H:m');
      }
      return datas;
    },

    /********************************* HTTP*/
    //http消息列表-刷新
    httpNotices() {
      if (this.isRefresh || this.isLoadinging) return;
      this.isRefresh = true;
      
      var type = (this.tabIndex == 1) ? "ANNOUNCEMENT" : "USER";
      var param = {'pageNo':1, 
                   'type':type};
      jhttps.post("systemV2/queryAnnouncementList",param,true,(data) => {
        this.isRefresh = false;
        if (data.status == 200) {

          data = data.data; 
          this.datas = this.initData(data);
          this.pageNo = 1;
          this.pageMax = this.datas.length < 20;
        } else {
          jmodal.toast(data.msg);
        }
      });
    },

    //http消息列表-加载
    httpNoticesLoading() {
      if (this.pageMax || this.isRefresh || this.isLoadinging) return;
      this.isLoadinging = true;

      var type = (this.tabIndex == 1) ? "ANNOUNCEMENT" : "USER";
      var param = {'pageNo':this.pageNo+1, 
                   'type':type};
      jhttps.post("systemV2/queryAnnouncementList",param,true,(data) => {
          this.isLoadinging = false;
        if (data.status == 200) {

          data = data.data;
          var datas = this.initData(data);
          this.datas.push(...datas);
          this.pageNo++;
          this.pageMax = datas.length < 20;
        } else {
          jmodal.toast(data.msg);
        }
      });
    },

    //全部已读
    httpAllRead(){

      jmodal.showLoad();
      var param = {};
      jhttps.postX("systemV2/announcementAllRead",param,true,(data) => {
        jmodal.hideLoad();
        if (data.status == 200) {
          jmodal.hideLoad();
          for (let index = 0; index < this.datas.length; index++) {
            var item = this.datas[index];
            item.isRead = true;
          }
        } else {
          jmodal.toast(data.msg);
        }
      });
    },

    /********************************* 点击*/
    //全部已读
    allClick(){
      
      var parm = {'title':T("全部已读"),
                  'message':T("确定将个人消息和系统公告的所有未读标记为已读？")};
      jmodal.confirm(parm, (bool)=>{
        if (bool == "true") {
          this.httpAllRead();
        }
      });
    },

    //导航栏点击
    navClick(index){
      this.tabIndex = index;
      this.httpNotices();
    },

    //列表点击
    cellClick(item){
      item.isRead = true;

      if (this.tabIndex == 0) {
        
        var param = {'noticeId':item.messageId,
                      'type':'USER'};
        var nav = {'navColor':'#0c0c0c'};
        jnavigator.open("", "mine/NoticeDetail", param, nav);
      } else {
        

        var dict = {'messageId':Number(item.messageId),
                    'type':''};
        var param = {'url':'/systemV2/queryAnnouncementDetail', 
                    'param':dict}
        jnavigator.openNative('HTML', param);
      }
    },
  }
}
</script>
